
import { read, utils } from 'xlsx'
// import { roleidToIsNodeApi } from '@/api/roleApi'

let batchAddUserFn = null
const dragexceluploadOver = evt => {
  evt.preventDefault()
}
const dragexceluploadDrop = evt => {
  // 数据的持久化数，拖拽时，保存数据所用的
  // evt.dataTransfer.setData/getData
  ;[...evt.dataTransfer.items].forEach(item => {
    let file = item.getAsFile()
    // 只能是excel文件 xlsx/xls
    const ext = file.name.split('.').pop()
    const size = 10 * 1024 * 1024
    // 文件类型
    if (!['xlsx', 'xls'].includes(ext)) {
      throw new Error('您上传的excel文件类型不合法，请重新上传');  
    }
    // 文件大小
    if (file.size > size) {
      throw new Error('您上传的文件过大，超过10M了');
    }
    // 解析excel文件
    const fileReader = new FileReader()
    fileReader.readAsArrayBuffer(file)
    fileReader.onload = e => {
      // excel它的数据流
      let buffer = e.target.result
      // 使用xlsx库完成对于数据源的解析
      let workBook = read(buffer, { type: 'binary' })
      // 读取对应单元薄中的数据
      let sheet = workBook.Sheets[workBook.SheetNames[0]]
      let json = utils.sheet_to_json(sheet)
      // 得到json数据后，一次性发送请求给服务器端，批量添加用户
      // console.log(json)
      batchAddUserFn(json)
    }
  })
}

const direc = (app) => {
  app.directive('dragexcelupload', {
    created(el, { value }) {
      batchAddUserFn = value
      el.addEventListener('dragover', dragexceluploadOver)
      el.addEventListener('drop', dragexceluploadDrop)
    },
    unmounted(el) {
      el.removeEventListener('dragover', dragexceluploadOver)
      el.removeEventListener('drop', dragexceluploadDrop)
      batchAddUserFn = null
    }    
  })
}

export default direc;



